/**
* Created by yyr on 2018/1/31
*已设立基金选项卡基金会议
*/
<template>
    <div>
        <div class="ca-m-t-15">
            <div class="ca-title ca-p-l-22">
                <h3>基金会议</h3>
                <div class="ca-pull-right">
                    <el-input placeholder="请输入关键词,支持模糊查询"  class="ca-w-280 ca-m-r-15" v-model="keyName"  @keyup.enter.native="getFundMeetingData">
                        <el-button slot="append" icon="el-icon-search" @click="getFundMeetingData()"></el-button>
                    </el-input>
                    <el-button type="primary" class="ca-m-l-10" @click="addFundMeeting()" :disabled="!isAuthFileEdit"><span>添加</span></el-button>
                </div>
                <div class="clear"></div>
            </div>
            <div class="ca-box ca-m-t-15 ca-p-20" v-for="(list,index) in fundMeetingData" :key='index'>
                <div v-if="!list.editStatus">
                    <el-row>
                        <el-col :span="6" class="ca-p-t-10">
                        <span class="ca-color__titleColor ca-font-size-14">
                             记录人：{{list.fundMeeting.userName}}
                        </span>
                        </el-col>
                        <el-col :span="6" class="ca-p-t-10">
                        <span class="ca-color__titleColor ca-font-size-14">
                             会议时间：{{$moment(list.fundMeeting.meetingTime).format("YYYY-MM-DD")}}
                        </span>
                        </el-col>
                        <el-col :span="6" class="ca-p-t-10">
                         <span class="ca-color__titleColor ca-font-size-14">
                              记录时间：{{list.fundMeeting.createTime? $moment(list.fundMeeting.createTime).format("YYYY-MM-DD") : ''}}
                        </span>
                        </el-col>
                        <el-col :span="6" class="ca-align-right">
                            <el-button type="text"   @click="fundMeetingEdit(list)" class="ca-edit-btn el-icon-edit" :disabled="!isAuthFileEdit">编辑</el-button>
                        </el-col>
                    </el-row>
                    <el-row class="ca-m-t-10 ca-align-center">
                        <h3>{{list.fundMeeting.title}}</h3>
                    </el-row>
                    <el-row class="ca-m-t-10">
                        <div  class="ca-color__titleColor ca-font-size-14">会议记录：</div>
                        <div class="ca-p-t-10 wordWrap">{{list.fundMeeting.recordContent}}</div>
                    </el-row>
                    <div class="ca-file-ul">
                        <div  class="ca-color__titleColor ca-font-size-14">文件记录：</div>
                        <el-row class="ca-file-row ca-m-t-10" v-for="(file,fileIndex) in list.fileList" :key="fileIndex">
                            <el-col :span="5">
                                <div class="ca-text-over-flow-ellipsis">{{file.fileType | getNameByType  }}</div>
                            </el-col>
                            <el-col :span="1">
                                <tz-icon-file-type class="ca-m-r-5" :fileType="file.fileName"></tz-icon-file-type>
                            </el-col>
                            <el-col :span="15">
                                <div class="ca-text-over-flow-ellipsis ca-pointer"
                                     @click="previewFileCheck(file.id, file.fileName)">
                                    <span class="ca-font-size-16 ca-pointer">{{file.fileName}}</span>
                                </div>
                            </el-col>
                            <el-col :span="3" class="ca-pull-right ca-align-right">
                                <a class="ca-download ca-m-r-10" @click="downloadFile(file.id)"></a>
                            </el-col>
                        </el-row>
                    </div>
                </div>
                <div v-if="list.editStatus">
                    <el-form label-width="100px">
                        <el-form-item label="会议时间	：">
                            <el-date-picker type="date" placeholder="选择日期" v-model="list.fundMeeting.meetingTime" style="width:350px" class="ca-pull-left"></el-date-picker>
                            <div class="ca-pull-right">
                                <el-button type="danger" size="small" @click="deleteMeeting(list)">删除</el-button>
                                <el-button type="primary" size="small" @click="saveMeeting(list)">保存</el-button>
                                <el-button size="small" @click="cancelEdit(list)">取消</el-button>
                            </div>
                        </el-form-item>
                        <el-form-item label="会议名称	：">
                            <el-input placeholder="请输入内容" v-model="list.fundMeeting.title" style="width:350px"></el-input>
                        </el-form-item>
                        <el-form-item label="会议记录	：">
                            <el-input type="textarea" :maxlength="300" placeholder="请输入内容" v-model="list.fundMeeting.recordContent">
                            </el-input>
                        </el-form-item>
                        <el-form-item label="添加文件	：">
                            <csUpload
                                :fileType="fileType"
                                :businessId="list.fundMeeting.id"
                                :isShowFileChildType="false"
                                uploadType="all"
                                @getFileList="getMeetingDetail(list, index, true)"
                            >
                            </csUpload>
                        </el-form-item>
                        <div class="ca-file-ul">
                            <el-row class="ca-file-row" v-for="(file, fileIndex) in list.fileList" :key="fileIndex">
                                <el-col :span="5">
                                    <div class="ca-text-over-flow-ellipsis">{{file.fileType | getNameByType  }}</div>
                                </el-col>
                                <el-col :span="1">
                                    <tz-icon-file-type class="ca-m-r-5" :fileType="file.fileName"></tz-icon-file-type>
                                </el-col>
                                <el-col :span="15">
                                    <div class="ca-text-over-flow-ellipsis ca-pointer"
                                         @click="previewFileCheck(file.id, file.fileName)">
                                        <span class="ca-font-size-16 ca-pointer">{{file.fileName}}</span>
                                    </div>
                                </el-col>
                                <el-col :span="3" class="ca-pull-right ca-align-right">
                                    <a class="ca-download ca-m-r-10" @click="downloadFile(file.id)"></a>
                                    <el-button class="ca-table-btn" @click="deleteFile(file.id, fileIndex, index)">
                                        <i class="fa fa-times"></i>
                                    </el-button>
                                </el-col>
                            </el-row>
                        </div>
                    </el-form>
                </div>
            </div>
        </div>
        <el-dialog  title="添加基金会议"
                    :visible=dialogVisible
                    @close='dialogVisible = false'
                    width="30%"
                    :show-close="false"
                    class="importantFixed">
            <el-form v-model="fundMeeting">
                <el-form-item label="会议时间" labelWidth="70px">
                    <el-date-picker
                        v-model="fundMeeting.meetingTime"
                        type="date"
                        placeholder="选择日期"  style="width:  100%;">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="会议名称" labelWidth="70px">
                    <el-input   v-model="fundMeeting.title" placeholder="请输入内容" :maxlength="100"></el-input>
                </el-form-item>
                <el-form-item label="会议记录" labelWidth="70px">
                    <el-input
                        v-model="fundMeeting.recordContent"
                        type="textarea"
                        :maxlength="500"
                        placeholder="请输入内容">
                    </el-input>
                </el-form-item>
                <el-form-item label="添加文件">
                    <el-row>
                        <csUpload
                            :fileType="fileType"
                            :businessId="itemId"
                            :isShowFileChildType="false"
                            uploadType="all"
                            :getFileUploadedReturnData="getFileUploadedReturnDataFun">
                        </csUpload>
                    </el-row>
                    <el-row class="ca-file-row ca-m-t-8 ca-m-l-10" v-for="(file, editIndex) in fileDetail" :key="editIndex">
                        <el-col :span="2">
                            <tz-icon-file-type class="ca-m-r-5" :fileType="file.fileName"></tz-icon-file-type>
                        </el-col>
                        <el-col :span="10">
                            <div class="ca-text-over-flow-ellipsis ca-pointer">
                                <span class="ca-font-size-16 ca-pointer">{{file.fileName}}</span>
                            </div>
                        </el-col>
                        <el-col :span="3">
                            <el-button class="ca-table-btn" @click="deleteFileItem(editIndex)">
                                <i class="fa fa-times"></i>
                            </el-button>
                        </el-col>
                    </el-row>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer" style="text-align: center">
                <el-button type="primary" @click="submitUpload()">确 定</el-button>
                <el-button @click="dialogVisible = false">取 消</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script type="text/ecmascript-6">
    import {api} from '../api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import mined from '__components/file-list/mixin';
    import { isNoAuth } from '__service/utils';
    export default {
        mixins: [mined],
        data() {
            return {
                isAuthFileEdit: isNoAuth('已设立基金-文件管理-编辑'),
                itemId: this.$route.params.fundId,
                keyName: '',
                fundMeeting: {
                    fundId: this.$route.params.fundId,
                    id: '',
                    meetingTime: '',
                    recordContent: '',//记录内容
                    title: '',//会议名称
                    userName: this.$store.state.user.cnName,//记录人姓名
                    createTime: '',
                },
                fileList: [],
                dialogVisible: false,
                fileType: '',
                fundMeetingData: [],//列表数据
                fileDetail: [],//上传成功返回的数据
            }
        },
        computed: {
        },
        mounted() {
            let fileTypeList = this.$store.state.user.fileFloderDicVoList;
            fileTypeList.map(item=>{
                if (item.name === '基金会议') {
                    this.fileType = item.type;
                }
            })
        },
        created() {
            this.getFundMeetingData();
        },
        props: {
        },
        methods: {
            //获取数据
            getFundMeetingData() {
                let query = {
                    fundId: this.itemId,
                    title: this.keyName,
                    id: ''
                }
                apiHttp(api.MEETING_LIST,query).then(ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        for (let i of ret.data) {
                            i.editStatus = false;
                        }
                        this.fundMeetingData = ret.data;
                    }
                })
            },
            fundMeetingEdit(list) {
                list.editStatus = true;
            },
            //添加基金会议
            addFundMeeting() {
                this.dialogVisible = true;
                this.fundMeeting = {
                    fundId: this.$route.params.fundId,
                    id: '',
                    meetingTime: '',
                    recordContent: '',//记录内容
                    title: '',//会议名称
                    userName: this.$store.state.user.cnName,//记录人姓名
                }
                this.fileDetail = []
            },
            //保存
            submitUpload() {
                let query = {
                    fileList: this.fileList,
                    fundMeeting: this.fundMeeting
                }
                apiHttp(api.ADD_MEETING,query).then(ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.$message({
                            type: 'success',
                            message: '添加成功!',
                            center: true
                        })
                        this.$emit('addRedDot', 6)
                        this.dialogVisible = false;
                        this.getFundMeetingData();
                        this.fileList = [];
                    }
                })
            },
            //文件成功返回的数据
            getFileUploadedReturnDataFun(arr) {
                arr.map(item=>{
                    this.fileList.push(item.id)
                })
                this.fileDetail = this.fileDetail.concat(arr);
            },
            //删除添加的一条文件
            deleteFileItem(index) {
                this.fileList.splice(index, 1);
                this.fileDetail.splice(index, 1);
            },
            //编辑保存
            saveMeeting(list) {
                let query = {
                    fileList: [],
                    fundMeeting: list.fundMeeting
                }
                apiHttp(api.CHANGE_MEETING,query).then(ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.$message({
                            type: 'success',
                            message: '修改成功！',
                            center: true
                        })
                        this.$emit('addRedDot', 6);
                        this.getFundMeetingData();
                    }
                })
            },
            //删除会议
            deleteMeeting(list) {
                this.$confirm('是否删除会议信息?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning',
                    shoeClose: false
                }).then(async () => {
                    apiHttp(api.DELETE_MEETING,{meetingId: list.fundMeeting.id}).then( ret=>{
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                center: true
                            });
                            this.getFundMeetingData();
                        }
                    })
                });
            },
            // 删除文件
            deleteFile(id, fileIndex, index) {
                this.$confirm('确认删除此文件?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    showClose: false
                }).then(async () => {
                    apiHttp(api.DELETE_FILE,{id: id}).then( ret=>{
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                center: true
                            });
                            this.fundMeetingData[index].fileList.splice(fileIndex, 1);
                        }
                    })
                })
            },
            cancelEdit(list) {
                list.editStatus = false;
            },
            getMeetingDetail(list,index,val) {
                list.editStatus = val;
                let query = {
                    fundId: this.itemId,
                    title: '',
                    id: list.fundMeeting.id
                }
                apiHttp(api.MEETING_LIST,query).then(ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        list.fileList = ret.data[0].fileList;
                    }
                })
            }
        },
        components: {
            'csUpload': require('__components/upload-btn/index'),//上传文件组件
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    .wordWrap{
        word-break: break-all;
    }
</style>
